
div {
    -moz-box-shadow: 3px 3px 3px #aaa;
    -webkit-box-shadow: 3px 3px 3px #aaa;
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#aaaaaa', Direction=135, Strength=3px);    /* IE */
	text-align:center;
}
img{
	border:none;
}
a:hover img.playerPic{
	border:3px solid #f60
}


/*for main area*/
#mainArea{
	height:620px;
	width:730px;
	margin-left: -5px;
	margin-top:-5px;
	background-repeat:no-repeat;
	background-image:url('http://mymixiaf.appspot.com/icons/b760.gif') 

}

/*for start view */


#loadingStr{
	padding: 5pt 5pt 5pt 5pt;
   	position: absolute;top: 300px;left: 240px;
   	background-color:#f90;
   	text-align:center;
   	color:#fff;
	font-size:30pt;
    height: 50px;
    width: 280px;
}

#nogame{
	padding: 5pt 5pt 5pt 5pt;
   	position: absolute;top: 250px;left: 150px;
   	background-color:#f90;
 
   	color:#fff;
	font-size:20pt;
    height: 120px;
    width: 450px;
}
#finishGreeting{
	padding: 5pt 5pt 5pt 5pt;
   	position: absolute;top: 250px;left: 150px;
   	background-color:#f90;
   	color:#fff;
	font-size:20pt;
    height: 120px;
    width: 450px;

}

#showFestivalButton{
	font-weight:bolder;
   	position: absolute;top: 80px;left: 130px;
 	color:#fff;
	background-color:#6c0;
	font-size:16pt;
	padding: 3pt 3pt 3pt 3pt;
    height: 35px;
    width: 200px;
}

#ruleHeader{
	font-weight:bolder;
   	position: absolute;top: 100px;left: 50px;
   	background-color:#f90;

	font-size:16pt;
	padding: 5pt 3pt 3pt 3pt;
	color:#fff;
    height: 30px;
    width: 150px;
}
#ruleArea{
padding: 5pt 3pt 3pt 3pt;
	position: absolute;top: 130px;left: 50px;
	background-color:#fff;
   	text-align:left;
	font-size:12pt;
    height: 420px;
    width: 650px;
	border:2px solid #f90;
}

#ruleExplanation{
	padding: 5pt 10pt 10pt 10pt;
	position: absolute;top: 0px;left: 0px;
  	text-align:left;
	font-size:12pt;
    height: 380px;
    width: 600px;
}


#prePlayersArea{
	position: absolute;top: 120px; left:5pt;
}

.friendsArea{
	text-align:center;
	padding: 5pt 5pt 5pt 5pt;   
    width: 630px;
	background-color:#fff;
	margin-left:auto;
	margin-right:auto;
}



.idArea{
	vertical-align:center;
	font-size:8pt;
	float:left;
	height:80px;
    width: 60px;
	max-height:80px;
	max-width:60px;
}





.preFields{
	font-size:10.5pt;
	position: absolute;top: 250px;
	height: 100px;
    width: 140px;
	background-color:#ddd;
}

.preTitle{
	font-weight:bolder;
	font-size:12pt;
	position: absolute;left: 30px;

}

#prePlayerTitle{
	position: absolute;top: 100px;
}

#preFieldTitle{
	position: absolute;top: 230px;
}

#preFields0{
	position: absolute; left: 185px;
}
#preFields1{
	position: absolute; left: 325px;
}
#startButton{
	padding: 3pt 3pt 3pt 3pt;

	color:#fff;
	background-color:#6c0;
	font-size:16pt;
	font-weight:bolder;
	position: absolute;top: 360px; left: 170px;
    height:40px;
	width: 300px;
}


#fieldArea{
	background-color:#ccc;
}

/*fieldArea style sheet*/
#fieldNum {
	text-align:center;
	font-size: 24pt;
	position:absolute; top:100px; left:300px;
	color:#fff;
	background-color:#f90;
	padding: 3pt 3pt 3pt 3pt;
	width:150px;
}
#fieldTitle {
	font-size: 28pt;
	position:absolute; top:150px; left:20px;
	width:690px;
	padding: 5pt 5pt 5pt 5pt;
	color:#fff;
	background-color:#f90;
}
#fieldQuestion{
	font-size: 26pt;
	margin:auto;	
	position:absolute; top:125px; left:10px;
	text-align:center;
	color:#fff;
	background-color:#f90;
}

#playerArea{
	background-color:#fff;
	border:2px solid #f90;
	position:absolute; top:200px; left:20px;
	width:700px;
	height:250px;
}

.playerBox{
	width:120px;
	height:180px;
	padding: 5px 5px 5px 5px;
	position:absolute; top:10px;
	background-color:#fff;
}
.playerPic{
	max-height:120px;
	max-width:120px;
}
.playerRanking{
	position:absolute; top:150px; left:40px;
	font-size:20pt;
}

.playerName{
	text-align:center;
	font-size:10.5pt;
}

.playerPic{
	position:absolute; top:30px; left:10px;
	width:70%;
}
.rankStr{
	position:absolute; top:155px; left:60px;
	color:#000;
	font-size:20pt;
}
#player0Area{
	position:absolute; left:10px;
}
#player1Area{
	position:absolute; left:145px;
}
#player2Area{
	position:absolute; left:280px;
}
#player3Area{
	position:absolute; left:415px;
}
#player4Area{
	position:absolute; left:550px;
}
#lastFields{
		position:absolute; top:215px; left:20px;
	font-size:18pt;
	color:#000;
}
#lastFieldNum{
	font-size:18pt;
	font-weight:bolder;
	color:#f30;
}
	

#resetButton{
	position:absolute; top:210px; left:580px; right:20px;
}

